//引入common文件
@import 'common.less';
//以屏幕宽度为750px为基础制作，font-size为50px
body{
    min-width: 320px;
    width: 15rem;
    margin: 0 auto;
    line-height: 1.5;
    background-color: #f7f7f7;
    font-family: Arial, Helvetica;
}
a{
    text-decoration: none;
}
.top{
    width: 15rem;
    height: (180rem / 50);
    background-color: #ffdb47;
    .top_content_one{
        height: (88rem / 50);
        width: (682rem / 50);
        margin:  0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
        :nth-child(2n-1){
            width: (36rem / 50);
        }
        :nth-child(2){
            width: (390rem / 50);
        }
    }
    .top_content_two{
        width: (702rem / 50);
        height: (92rem /50);
        margin: 0 auto;
        a{
            width: (702rem / 50);
            height: (64rem /50);
            margin-top: (14rem / 50);
            display: block;
            background-color: #ffffff;
            border-radius: (46rem / 50);
            color: #757575;
            img{
                width: (36rem / 50);
                position: relative;
                top: -(4rem / 50);
                left: (20rem / 50);
            }
            span{
                position: relative;
                top: -(12rem / 50);
                left: (20rem / 50);
                font-size: (28rem / 50);
            }
        }
    }
}
.banner{
    width: 15rem;
    height: (229rem / 50);
    background: url(../image/bannerBackground.png) 15rem;
    .banner_swiper{
        width: (720rem / 50);
        height: (229rem / 50);
        margin: 0 auto;
        overflow: hidden;
        border-radius: (20rem / 50);
        .banner_swiper_wrap{
            width: (7 * 720rem / 50);
            height: (229rem / 50);
            display: flex;
            justify-content: center;
            margin-left: -(720rem / 50);
            .banner_swiper_item{
                width: (720rem / 50);
                height: (229rem / 50);
                border-radius: (20rem / 50);
                overflow: hidden;
                position: relative;
               img{
                width: (750rem / 50);
                height: (368rem / 50);
                position: absolute;
                top: -(139rem / 50);
                left: -(15rem / 50);
                } 
            }
        }
    }
}
.classify{
    width: 15rem;
    height: (284rem / 50);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: space-between;
    background-color: #f4f4f4;
    div{
        width: 3rem;
        height: (142rem / 50);
        text-align: center;
        a{
            color: #666666;
            font-size: (22rem / 50);
            img{
                width: (84rem / 50);
                position: relative;
                top: (20rem / 50);
            }
        }
    }
}